{% extends "base.html" %}
{% load i18n %}

{% block pageContent %}

<fieldset>
	<input id="embedCode" type="text" size="60" value="{{ wideEmbedCode }}" onclick="javascript:$('#embedCode').select();"/>
	{% if False %}<button id="copyEmbedCode">{% trans "Copy Embed Code" %}</button>{% endif %}
	<br/>{% trans "Widget Type" %}: 
	<select id="widgetType" onchange="javascript:switchEmbed();">
		<option value="thin">{% trans "Thin" %}</option>
		<option value="wide" selected>{% trans "Wide" %}</option>
	</select>
</fieldset>

<div id="embedDiv" align="center">
		{{ wideEmbedCode|safe }}
</div>

<script type="text/javascript">
<!--

var embedCode = '{{ embedCode|safe }}';
var wideEmbedCode = '{{ wideEmbedCode|safe }}';

function switchEmbed()
{
	switch ($('#widgetType').attr('value')) {
		case 'thin':
			$('#embedCode').attr('value', embedCode);
			$('#embedDiv').html(embedCode);
			break;
		case 'wide':
			$('#embedCode').attr('value', wideEmbedCode);
			$('#embedDiv').html(wideEmbedCode);
			break;
	}
}

{% if False %}
$.clipboardReady(function(){
	$("#copyEmbedCode").click(function(){
		$.clipboard( $("#embedCode").value() );
		alert("{% trans "The embed code has been copied to your clipboard." %}"); 
		return false;
	});
});
{% endif %}
-->
</script>

{% endblock pageContent %}